<g:form id="sendMessageForm" name="sendMessageForm" controller="${formController}"
			action="${formAction}">
			
	<div class="form-horizontal">
	
		<g:if test="${showTo}">
		<div class="control-group ${flash.error ? 'error' : ''}">
			<label class="control-label" for="client"><g:message
					code="messages.to" /> </label>
			<div class="controls">
				<g:textField id="txt_client" name="to" class="input-xlarge"
					value="${msg?.userMessage?.to}" maxlength="100"  required="" 
					placeholder="${message(code: 'messages.to')}" />
			</div>
		</div>
		</g:if>
		
		<sec:ifNotLoggedIn>
			<div class="control-group ${flash.error ? 'error' : ''}">
				<label class="control-label" for="sender"><g:message
						code="messages.from" /> </label>
				<div class="controls">
					<g:textField id="txt_sender" name="from" class="input-xlarge"
						value="${msg?.userMessage?.from}" maxlength="100"  required="" 
						placeholder="${message(code: 'messages.from')}" />
				</div>
			</div>
		</sec:ifNotLoggedIn>

		<div class="control-group">
			<label class="control-label" for="subject"><g:message
					code="user.message.subjet" /></label>
			<div class="controls">
				<g:field id="subject" class="input-xlarge" type="text"
					name="subject" value="${msg?.subject}" maxlength="30"  required="" 
					placeholder="${message(code: 'user.message.subjet')}" />
			</div>
		</div>

		<div class="control-group">
			<label class="control-label" for="message"><g:message
					code="user.message" /></label>
			<div class="controls">
				<g:textArea onkeyup="textCounter(this,'counter',350);"
					id="message" name="message" class="messageArea" rows="3"  required="" 
					maxlength="350" value="${msg?.message}" ></g:textArea>
				<p id="counter" class="messageCharactersRemaining">350</p>
			</div>

		</div>
		
		
		
		<div class="btn-group">
			<button class="btn btn-success" form="sendMessageForm">
				<g:message code="send" />
			</button>
			<g:if test="${showBack}">
				<g:link class="btn btn-success" action="index">
					${message(code: 'messages.back')}
				</g:link>
			</g:if>
		</div>
		
		
	</div>
</g:form>

<g:javascript src="jquery-ui.autocomplete.js" />

	<script type="text/javascript">
     
		jQuery(document).ready(function(){
	
			$('#txt_client').autocomplete({        	
	        	source: "${createLink(controller: 'user', action: 'autocompleteUser')}"          
	        });
	   	});
	   	
		function textCounter(message, counter, maxlimit) {
			var countfield = $("#" + counter);
		 	if ( message.value.length > maxlimit ) {
		  		message.value = field.value.substring( 0, maxlimit );
		  		return false;
		 	} else {
		  		countfield.html(maxlimit - message.value.length);
		 	}
		}
	   	
    </script>